<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<head>
<meta charset="UTF-8">
<title>账单管理</title>
        <link type="text/css" rel="stylesheet" media="all" href="../css/global.css" />
        <link type="text/css" rel="stylesheet" media="all" href="../css/global_color.css" /> 
        <script language="javascript" type="text/javascript">
            //写入下拉框中的年份和月份
            function initialYearAndMonth() {
                //写入最近3年
                var yearObj = document.getElementById("selYears");
                var year = (new Date()).getFullYear();
                for (var i = 0; i <= 2; i++) {
                    var opObj = new Option(year - i, year - i);
                    yearObj.options[i] = opObj;
                }
                //写入 12 月
                var monthObj = document.getElementById("selMonths");
                var opObj = new Option("全部", "全部");
                monthObj.options[0] = opObj;
                for (var i = 1; i <= 12; i++) {
                    var opObj = new Option(i, i);
                    monthObj.options[i] = opObj;
                }
            }
        </script>
    </head>
    <body onload="initialYearAndMonth();">
        <!--Logo区域开始-->
        <div id="header">
            <img src="../images/logo.png" alt="logo" class="left"/>
            <a href="#">[退出]</a>            
        </div>
        <!--Logo区域结束-->
        <!--导航区域开始-->
        <%@ include file="../head.jsp" %>
        <!--导航区域结束-->
        <!--主要区域开始-->
        <div id="main">
            <form action="${pageContext.request.contextPath }/bill/bill_list.do" method="post">
                <!--查询-->
                <div class="search_add">                        
                    <div>身份证：<input type="text"  name="bidcard" class="text_search" /></div>
                    <div>账务账号：<input type="text" name="bacname" class="width100 text_search" /></div>                            
                    <div>姓名：<input type="text" name="bname" class="width70 text_search" /></div>
                    <div>
                        <select class="select_search" id="selYears">
                        </select>
                        年
                        <select class="select_search" id="selMonths">
                        </select>
                        月
                    </div>
                    <div><input type="submit" value="搜索" class="btn_search" /></div>
                </div>  
                <!--数据区域：用表格展示数据-->  
                <div id="data">            
                    <table id="datalist">
                    <tr>
                        <th class="width50">账单ID</th>
                        <th class="width70">姓名</th>
                        <th class="width150">身份证</th>
                        <th class="width150">账务账号</th>
                        <th>费用</th>
                        <th class="width100">月份</th>
                        <th class="width100">支付方式</th>
                        <th class="width100">支付状态</th>                                                        
                        <th class="width50"></th>
                    </tr>
                    <c:forEach items="${bills}" var="bill" varStatus="status">
	                    <tr>
	                        <td>${bill.bid}</td>
	                        <td>${bill.bname}</td>
	                        <td>${bill.bidcard}</td>
	                        <td>${bill.bacname}</td>
	                        <td>${bill.bcost}</td>
	                        <td>${bill.bmonth}</td>
	                        <td>${bill.btype}</td>
	                        <td>${bill.bstatus}</td>                            
	                        <td><a href="${pageContext.request.contextPath }/bill/bill_item.do" title="账单明细">明细</a></td>
	                    </tr>
                    </c:forEach>
                    
                </table>
                
                <p>业务说明：<br />
                1、设计支付方式和支付状态，为用户自服务中的支付功能预留；<br />
                2、只查询近 3 年的账单，即当前年和前两年，如2013/2012/2011；<br />
                3、年和月的数据由 js 代码自动生成；<br />
                4、由数据库中的ｊｏｂ每月的月底定时计算账单数据。</p>
                </div>                    
                <!--分页-->
                <div id="pages">
        	        共${totalRecord}条数据  每页${pageSize}条  页次 ${currentPage}/${pageCount}页
					<c:choose > 
						<c:when test="${currentPage == 1}">    <!--如果 --> 
							<a href="${pageContext.request.contextPath }/bill/bill_list.do?currentPage=${currentPage+1}">下一页</a>
							<a href="${pageContext.request.contextPath }/bill/bill_list.do?currentPage=${pageCount}">尾页</a>	
						</c:when>      
						<c:when test="${currentPage == pageCount}">  <!--否则 -->    
							<a href="${pageContext.request.contextPath }/bill/bill_list.do?currentPage=1">首页</a>
							<a href="${pageContext.request.contextPath }/bill/bill_list.do?currentPage=${currentPage-1}">上一页</a>
						</c:when> 
						<c:otherwise >  <!--否则 -->     
							<a href="${pageContext.request.contextPath }/bill/bill_list.do?currentPage=1">首页</a>
							<a href="${pageContext.request.contextPath }/bill/bill_list.do?currentPage=${currentPage-1}">上一页</a>
							<a href="${pageContext.request.contextPath }/bill/bill_list.do?currentPage=${currentPage+1}">下一页</a>
							<a href="${pageContext.request.contextPath }/bill/bill_list.do?currentPage=${pageCount}">尾页</a>
						</c:otherwise> 
					</c:choose>
                </div>                  
            </form>
        </div>
        <!--主要区域结束-->
        <div id="footer">
            
           
        </div>
    </body>
</html>